<%@ page language="java" contentType="text/html; charset=UTF-8" import="java.util.*,
com.brother.model.*, com.brother.util.*,com.brother.*"   pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<%@ include file="international.jsp" %> 
<jsp:useBean id="trackerService" class="com.brother.service.TrackerService"></jsp:useBean>
<%
String action = request.getParameter("action");
if(action != null && action.equalsIgnoreCase("del")){
	String trackerid = request.getParameter("trackerid");
	trackerService.deleteTracker(trackerid);
}

session.setAttribute(Constants.TOP_WIDTH, "208px");

com.brother.model.Customer user = (com.brother.model.Customer)session.getAttribute(com.brother.Constants.LOGIN_SESSTION_NAME);
List<Tracker> trackers =new ArrayList();
if(user != null){
	trackers = trackerService.findUserTracker(user.getUserid()); 
}else{
	return;
}

%>

<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title><fmt:message key="realtime.title"/> - <fmt:message key="company.name"/></title>
<meta name="description" content="" />
<link rel="stylesheet" type="text/css" media="all" href="style.css" />

<link rel="stylesheet" type="text/css" href="css/ext-all.css" />
<link rel="stylesheet" type="text/css" href="css/grid-examples.css" />
<style type=text/css>
        /* style rows on mouseover */
        .x-grid3-row-over .x-grid3-cell-inner {
            font-weight: bold;
        }
        .x-grid3-scroller{
        	overflow:auto;
			position:relative;
			height:100%;
			
        }
        .x-grid3-cell-inner{
         	text-align:left;
        }
        .x-grid3-hd-inner{
        	text-align:left;
        }
        .x-grid3{
        	height:100%;
        }
        .x-grid3-viewport{
        	height:100%;
        }
        
    </style>
    <script>
    	var gpstracker_map = new Array();
    </script>
    <script type="text/javascript" src="js/ext-base.js"></script>
    <script type="text/javascript" src="js/ext-all.js"></script>
    <script type="text/javascript" src="js/extgrid.js"></script>
	<script type="text/javascript" src="js/search.js"></script>
	<script type="text/javascript" src="js/alarmprompt.js"></script>
	
</head>
<body onload="comet.initialize(); initialize();createSearchGrid();" onunload="comet.onUnload();GUnload()">
<div id="msg" name="msg" style="background-color:#D4DF55; position:absolute; z-index:11; left: 10px; top: 61px; display:inline"></div>
<script type="text/javascript" src="common.js"></script>
<script type="text/javascript" src="js/distanceDetect.js"></script>

<!-- 
<script type='text/javascript' 
        src='http://getfirebug.com/releases/lite/1.2/firebug-lite-compressed.js'></script> -->

        
<script>
var trackerUserid = '<%=user.getUserid()%>';
  function Point(iX, iY){ 
     this.x = iX; 
     this.y = iY; 
  } 
 function fGetXY(obj){ 
           var oTmp = obj;     
           if(!oTmp||(typeof(oTmp.offsetLeft) == "undefined") 
               ||(typeof(oTmp.offsetTop) == "undefined") 
               ||!oTmp.tagName){ 
                return null; 
           } 
           var pt = new Point(0,0);   
           do{ 
      pt.x += oTmp.offsetLeft; 
      pt.y += oTmp.offsetTop; 
      //alert(oTmp.parentNode.tagName);
      oTmp = oTmp.parentNode; 
  } while(oTmp.tagName!="BODY"); 
  return pt; 
       } 
       
	   var gMsgTop = 0; //fGetXY(document.getElementById("tmp_pos")).y;
function show_tip(msg)
{
	if (gMsgTop == 0)
	{
		gMsgTop = fGetXY(document.getElementById("tmp_pos")).y + 5;
		document.getElementById("msg").style.top = gMsgTop;
		document.getElementById("msg").style.display = "inline";
		// alert(document.getElementById("msg").style.offsetTop);
	}
	
	document.getElementById("msg").innerHTML = msg;
}

trackerHeader = '<fmt:message key="grid.trackerHeader"/>';
var locale = '<%=(String)session.getAttribute("locale")%>';

function get_gps_cmd_str(cmd)
{
	if (cmd == 0)
	{
		return "<fmt:message key="alarm.gps.pos"/>";
	}
	else if (cmd == "1")
	{
		return "Input 1";
	}
	else if (cmd == "2")
	{
		return "Input 2";
	}
	else if (cmd == "3")
	{
		return "Input 3";
	}
	else if (cmd == "4")
	{
		return "<fmt:message key="alarm.gps.over.speed"/>";
	}
	else if (cmd == "5")
	{
		return "<fmt:message key="alarm.gps.geo.fence"/>";
	}
	else if (cmd == "6")
	{
		return "<fmt:message key="alarm.power.lost"/>";
	}
	else if (cmd == "7")
	{
		return "<fmt:message key="alarm.low.power"/>";
	}
	
	return "<fmt:message key="alarm.unknown"/>";
}

</script>
<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
<tr valign="top">
	<td>
<jsp:include page="top.jsp"/>
	</td>
</tr>

<tr height="3px"></tr>
<tr valign="top">
	<td height="100%" align="left" style="padding-left:8px; padding-right:8px;"><style>
blink{behavior:url(#default#time2)}
input{
font-size: 12px;
}
</style>
<script charset="utf-8" src="http://maps.google.com/maps?file=api&v=2&key=<%=com.brother.util.CommonProperties.getGoogleMapKey(request.getServerName()) %>&sensor=true&hl=<%=session.getAttribute("locale").toString().equals("zh")?"zh_CN":"en"%>" type="text/javascript"></script>
<script>
	
</script>
<script language=javascript src="js/google_map.js"></script> <script>

var time_zone = <%=user.getTimeZoneOffSet()%>;
var g_default_time_zone_hours = parseInt(time_zone);
var g_default_time_zone_minutes = (time_zone - parseInt(time_zone)) * 60;

var g_str_comment = "";
var g_str_id = "ID:";
var g_str_lat = "<fmt:message key="location.lat"/>:";
var g_str_lng = "<fmt:message key="location.lng"/>:";
var g_str_signal = "Signal:";
var g_str_speed = "<fmt:message key="report.speed"/>:";
var g_str_state = "<fmt:message key="report.state"/>:";
var userid = "<%=user.getUserid()%>";



</script>
<script language=javascript src="js/gps.js"></script><script>
	var g_uin = "<%=user.getName()%>";
</script>
<script language=javascript src="js/comet.js"></script>

    <script type="text/javascript">
	var g_str_no_data = "<fmt:message key="realtime.no.data"/>";
	var g_str_comment = "<fmt:message key="realtime.comment"/>";
	var g_str_select_tracker = "<fmt:message key="realtime.select.tracker.to.control"/>";
	
	var g_default_lat = 40.7588;
	var g_default_lng = -74.0009;
	var g_default_level = 14;
	var g_default_type = G_NORMAL_MAP;
	var g_show_nosignal = 1;
	var g_uin_str = "";
<%for(int i = 0; i < trackers.size(); i++){%>
	g_uin_str ='';//+= "<%=trackers.get(i).getUserTrackerId()%>,";
<%}%>

var gridHeight  = 332;

    </script>

	<script language=javascript src="js/realtime.js"></script>
	<script type="text/javascript">
		//g_interval_ani = 500;

</script>	



	<table width="100%" height="100%" border="0">
		<tr valign="top">
			<td width="300px">
				<table width="100%" style="height:100%;" >
					<tr style="display:none">
						<td style="padding-top:8px;"><fmt:message key="realtime.select.gps.tracker"/>: &nbsp;(<a href="gps_editproduct.jsp"><fmt:message key="realtime.add.new"/></a>)</td>
					</tr>
					<tr>
						<td>

					
<table class="tableNoBorder" cellspacing="3" width="100%">
<tr>
<td class="tableLeftTitle" align="right" nowrap="nowrap" ><fmt:message key="search.user.name"/>:</td>
<td ><input type="text" id="userAutocomplete" size="20" /></td>
</tr>
<tr>
<td class="tableLeftTitle" nowrap="nowrap" align="right"><fmt:message key="search.tracker"/>:</td>
<td><input type="text" id="trackersAutocomplete" size="20" /></td>
</tr>

<tr><td colspan="2">
<input type="button" value="<fmt:message key="report.search"/>" onclick="reloadTrackerGrid();"/>
<fmt:message key="realtime.show.all.trackers"/>:<input type="checkbox" value="" name="" id="showMutilTrackers"/>
</td></tr>
</table>

<div id="grid-trackers" style="height:334px"></div>
					



						</td>
					</tr>
					<tr>
						<td style="padding-top:8px;">
							<span style="font-weight:bold"><fmt:message key="tracker.name"/>:&nbsp;<span id="info_title" style="display:inline"></span></span>
						</td>
					</tr>
					<tr>

						<td>
							<table width="100%" cellpadding="0" cellspacing="0">
							<tr>
								<td nowrap="nowrap">
									<b><fmt:message key="realtime.date"/>:</b> <div id="info_date" style="display:inline"></div>
									&nbsp;</div>
								</td>
							</tr>
							<tr>
								<td nowrap="nowrap">
									<b><fmt:message key="realtime.time"/>:</b> <div id="info_time" style="display:inline"></div>
									&nbsp;<div id="info_comment" style="display:inline"></div>
								</td>
							</tr>

							<tr>
								<td width="50%" nowrap="nowrap">
									<b><fmt:message key="location.lat"/>:</b>&nbsp;<div id="info_lat" style="display:inline"></div>
								</td>
								
							</tr>
							<tr>	
								<td width="50%" nowrap="nowrap">
									<b><fmt:message key="location.lng"/>:</b>&nbsp;<div id="info_lng" style="display:inline"></div>
								</td>
							</tr>

							<tr style="display:none">
								<td nowrap="nowrap">
									<b><fmt:message key="report.signal"/>:</b>&nbsp;<div id="info_signal" style="display:inline"></div>
								</td>
							  </tr>
								<tr>
								<td nowrap="nowrap">
									<b><fmt:message key="report.speed"/>:</b>&nbsp;<div id="info_speed" style="display:inline"></div>
								</td>
							</tr>					
							<tr style="display:none">
								<td nowrap="nowrap">
									<b><fmt:message key="report.state"/>:</b>&nbsp;<div id="info_state" style="display:inline"></div>
								</td>
							  </tr>
								<tr style="display:none">
								<td nowrap="nowrap">
									<span ><b><fmt:message key="report.orient"/>:</b>&nbsp;<div id="info_direction" style="display:inline"></div></span>
								</td>
								
							</tr>
							<tr>

								<td colspan="2" height="70" valign="top">
									<b><fmt:message key="location.address"/>:</b>&nbsp;<div name="info_address" id="info_address" style="height:25px;white-space: normal;word-spacing: normal"></div>
								</td>
							</table>
						</td>
					</tr>
					<tr style="display:none">
						<td style="font-weight:bold; padding-top:6px;"><fmt:message key="realtime.output"/>:</td>

					</tr>					
					<tr style="display:none">
						<td style="font-size:11px">
    <style type="text/css">  
    .scroll {   
    }   
    </style> 						
							<div class="scroll" id="tip" name="tip" style="border-color:#dddddd; border-width:1px; border-style:solid;width:200px;height:150px; overflow-x:hidden ;overflow-y:scroll;">
							</div>
						</td>
					</tr>
					<tr>
						<td valign="bottom">
						<table cellpadding="3" style="font-size:9px;">
							<tr>
								<td>


									<img src="arrow/nosignal.gif"  id="signalImg"/>&nbsp;<span style="display:"  id="offlineText"><fmt:message key="report.no.signal"/></span><span style="display:none"  id="onlineText"><fmt:message key="realtime.online"/></span>								</td>
								<td style="padding-left:20px">
									<img src="arrow/noalarm.gif"  id="alarmImg"/>&nbsp;<span style="display:none"  id="alarmText"><fmt:message key="report.alarm"/></span><span style="display:"  id="noalarmText"><fmt:message key="report.alarm.no"/></span>								</td>
							</tr>
						</table>

						</td>
					</tr>					
				</table>
				
			</td>

			<td width="20">&nbsp;</td>
			<td width="100%" height="100%">
				<table width="100%" height="100%">
					<tr>
						<td>						
						<script type="text/javascript" src="js/submodal.js"></script>
						<script language="javascript">renderPopWin();</script>
						<div id="control_area" style="display:none;">

						<table cellpadding="0" cellspacing="0">
							<tr>

								<td>
									<input type="button" value="<fmt:message key="tracker.parameters.set"/>" onclick="DoControl('parameters.jsp', 800, 450)"/>
								</td>	
								<td>
									<input type="button" value="<fmt:message key="realtime.geo.fence"/>" onClick="DoControl('sysgeofence.jsp',650,450)"></input>
								</td>


								
								<td>
									<input type="button" value="<fmt:message key="map.measure"/>" onClick="beginMeasure();"></input>
								</td>	
										
	
										
							</tr>
						</table>
						</div>
						</td>
					</tr>
					<tr>
						<td width="100%" height="100%">

						    <div id="map_canvas" style="position:relative; width: 100%; height: 100%;">
					      <fmt:message key="realtime.loading.map"/></div>
					  </td>
					</tr>
					
			  </table>
			</td>
		</tr>
		<tr style="display:none">
			<td colspan="3" width="100%" bgcolor="#FFFFFF">
				<strong><fmt:message key="realtime.information"/>:</strong><br /> 
				<div id="info_prompt" style="color:#999999; border-color:#EEEEEE; border-width:1px; border-style:solid;width:100%;height:50px; overflow-x:hidden ;overflow-y:scroll;"></div>

			</td>
		</tr>
	</table>
	</td>
</tr>
<tr>
	<td colspan="3"><hr size=1 color="#a9bad3">
		<table width="100%" align="center">
			<tr>
				<td align="center">
<script>
function pan(){
    var d = new GPS_LatLng(74, 115);
    	g_map.panTo(d);	
}
</script>
					<span style="color:#A0A0A4">Copyright &copy; 2008, All rights reserved. - <a href="mailto:">Contact us</a></span>
				</td>
			</tr>
		</table>
	</td>
</tr>
</table>

    <div id="prompt" class="BottomPromt">
    
    <div class="divRow title" onclick="showHideAlarm();"><div style="width:60px;float:left">Alarm</div><div class="x-tool x-tool-close" onclick="closeAlarmPrompt();" style="margin-bottom:0px; margin-top:0px;padding-top:0px;padding-bottom:0px;float:right;"> </div></div>
	<div class="content">
    </div>
    </div>
<bgsound id=wav_alert src="" loop="2">
</body>

</html>
<%
com.brother.database.DataBase.closeThreadConnection();
%>